// pages/test/index.js
const app = getApp()
Page({

     /**
      * 页面的初始数据
      */
	data: {
		bi: '',
		height: '',
		userInfo: {},
		isVip: false,
		canvasData: [
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: '11:13',
				color:'#efefef',
				coordinate: [346, 27], //坐标
				fontSize: '23', //字体大小
				imgSize: [], //图片大小
			},
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: '5,968.0000',
				color: '#333',
				align:'right',
				coordinate: [498, 330], //坐标
				fontSize: '45', //字体大小
				imgSize: [], //图片大小
			},
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: 'mag',
				align:'left',
				color: '#333',
				coordinate: [518, 339], //坐标
				fontSize: '18', //字体大小
				imgSize: [], //图片大小
			},
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: '0XFADAISDHIAFOAJSODJOAS6DASDAS8DAS8DAS',
				align: 'left',
				color: '#333',
				coordinate: [37, 482], //坐标
				fontSize: '18', //字体大小
				imgSize: [], //图片大小
			},
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: '0XFADAISDHIAFOAJSODJOAS6DASDAS8DAS8DAS',
				align: 'left',
				color: '#333',
				coordinate: [37, 564], //坐标
				fontSize: '18', //字体大小
				imgSize: [], //图片大小
			},
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: '0.9862 ether',
				align: 'left',
				color: '#333',
				coordinate: [37, 643], //坐标
				fontSize: '18', //字体大小
				imgSize: [], //图片大小
			},
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: '备注怎么填',
				align: 'left',
				color: '#333',
				coordinate: [37, 727], //坐标
				fontSize: '18', //字体大小
				imgSize: [], //图片大小
			},
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: '0X8775D...SD56564',
				align: 'left',
				color: 'rgb(54,185,200)',
				coordinate: [68, 875], //坐标
				fontSize: '18', //字体大小
				imgSize: [], //图片大小
			},
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: '59242857',
				align: 'left',
				color: '#333',
				coordinate: [37, 955], //坐标
				fontSize: '18', //字体大小
				imgSize: [], //图片大小
			},
			{
				type: 'text', //数据类型 img 图片、text 文字
				content: '59242857',
				align: 'left',
				color: '#333',
				coordinate: [37, 1035], //坐标
				fontSize: '18', //字体大小
				imgSize: [], //图片大小
			}
		]
	},

     /**
      * 生命周期函数--监听页面加载
      */
	onLoad: function (options) {
		wx.showLoading({
			title: '加载中...',
		})
		let that = this;
		var windowWidth = wx.getSystemInfoSync().windowWidth;
		var bi = (windowWidth * 0.6) / 750;
		that.setData({
			bi: bi,
			height: 1334 * bi + 30 + 'px'
		});

		let nowTime = Math.round(new Date().getTime() / 1000).toString();
		//微信登录
		app.login(function (userInfo) {
			that.setData({
				userInfo: userInfo.data
			})
			//查询是否是vip了
			if (userInfo.data.vipEndTime > nowTime || userInfo.data.vipEndTime == 'ever') {
				that.setData({
					isVip: true
				});
				if (userInfo.data.vipEndTime != 'ever') {
					that.setData({
						startTime: app.format(userInfo.data.vipStartTime),
						endTime: app.format(userInfo.data.vipEndTime)
					});
				}

			} else {
				var canvasData = that.data.canvasData;
				canvasData.push({
					type: 'img',
					content: '../images/ma.png',
					coordinate: [500, 1060],
					fontSize: '',
					imgSize: [250, 250]
				});
				that.setData({
					isVip: false
				});

			}
		});

		//从提交数据页面获取提交的数据
		wx.getStorage({
			key: 'canvasData',
			success: function (res) {
				var randomWord = app.randomWord(false, 43);
				var randomWord1 = app.randomWord(false, 8) + '...' + app.randomWord(false, 8);
				var canvasData = that.data.canvasData;
				canvasData[0].content = res.data.time;
				canvasData[1].content = res.data.zhuanzhangshuliang;
				canvasData[2].content = res.data.tokenName;
				canvasData[3].content = res.data.fakuandizhi == "" ? app.randomWord(false, 43) : res.data.fakuandizhi;
				canvasData[4].content = res.data.shoukuandizhi == "" ? app.randomWord(false, 43) : res.data.shoukuandizhi;
				canvasData[5].content = res.data.kuanggongfei + ' ether';
				canvasData[6].content = res.data.beizhu;
				canvasData[7].content = res.data.jiaoyihao == '' ? randomWord1 : res.data.jiaoyihao;
				canvasData[8].content = res.data.qukuai;
				canvasData[9].content = res.data.jiaoyiTime;
			

				//生成图片吖
				console.log('http://wechat-program.maggie.vip/images/imToken1/kong-' + res.data.equipmentType + '.png');
				wx.getImageInfo({
					src: app.globalData.siteroot + 'images/imToken1/kong-' + res.data.equipmentType + '.png',
					success: function (res) {

						//页面上显示的生成结果
						var ctx = wx.createCanvasContext("token");
						that.setCanvas(ctx, res, 1);
						//成功执行，draw方法中进行回调
						ctx.draw(true, function () {
							console.log("draw callback success")
						})

						//可以下载的生成结果
						var ctx = wx.createCanvasContext("tokenTrue");
						that.setCanvas(ctx, res);
						//成功执行，draw方法中进行回调
						ctx.draw(true, function () {
							console.log("draw callback success")
							wx.hideLoading()
						})
					}
				})
			}
		})

	},
	setCanvas: function (ctx, res, type) {
		let that = this;
		var windowWidth = wx.getSystemInfoSync().windowWidth;
		var bi = (windowWidth * 0.6) / 750;
		//填充背景色
		ctx.setFillStyle('#fff');


		//添加图片
		if (type == 1) {
			ctx.scale(bi, bi);
		}
		ctx.drawImage(res.path, 0, 0, 750, 1334);

		ctx.setTextBaseline('middle');
		ctx.setTextAlign('left');
		//划线三次		

		//向canvas中添加数据
		var cdata = that.data.canvasData;
		for (var i = 0; i < cdata.length; i++) {
			if (cdata[i]['type'] == 'text') {
				ctx.setFillStyle(cdata[i].color);
				ctx.setFontSize(cdata[i].fontSize);
				ctx.setTextAlign(cdata[i].align);
				ctx.fillText(cdata[i].content, cdata[i].coordinate[0], cdata[i].coordinate[1]);
			} else if (cdata[i]['type'] == 'img') {

				ctx.save(); // 先保存状态 已便于画完圆再用
				ctx.beginPath(); //开始绘制
				//先画个圆
				ctx.arc(cdata[i].coordinate[0] + (cdata[i].imgSize[0] / 2), cdata[i].coordinate[1] + (cdata[i].imgSize[0] / 2), cdata[i].imgSize[0] / 2, 0, Math.PI * 2, true);
				ctx.clip();
				ctx.drawImage(cdata[i].content, cdata[i].coordinate[0], cdata[i].coordinate[1], cdata[i].imgSize[0], cdata[i].imgSize[1]);
				ctx.restore();
			}
		}



	},
     /**
      * 生命周期函数--监听页面初次渲染完成
      */
	onReady: function () {

	},

     /**
      * 生命周期函数--监听页面显示
      */
	onShow: function () {

	},

     /**
      * 生命周期函数--监听页面隐藏
      */
	onHide: function () {

	},

     /**
      * 生命周期函数--监听页面卸载
      */
	onUnload: function () {

	},

     /**
      * 页面相关事件处理函数--监听用户下拉动作
      */
	onPullDownRefresh: function () {

	},

     /**
      * 页面上拉触底事件的处理函数
      */
	onReachBottom: function () {

	},

     /**
      * 用户点击右上角分享
      */
	onShareAppMessage: function () {

	},
	saveImg: function () {
		//保存临时图片
		wx.canvasToTempFilePath({
			x: 0,
			y: 0,
			destWidth: 750,
			destHeight: 1334,
			canvasId: 'tokenTrue',
			quality: '1',
			success: function (res) {
				console.log("get tempfilepath(success) is:", res.tempFilePath)
				//将图片保存在系统相册中(应先获取权限，)
				wx.saveImageToPhotosAlbum({
					filePath: res.tempFilePath,
					success(res) {
						wx.showToast({
							icon: 'success',
							title: '图片保存成功',
						})
						console.log("save photo is success")
					},
					fail: function () {
						console.log("save photo is fail")
					}
				})
			},
			fail: function (e) {
				console.log(e)
			}
		})
	}
})